<template>
    <view class="page-wallet-withdraw">
        <view class="form">
            <view class="balance">可提现金额：<text class="font-bold c-cyan">{{wallet.balance}}元</text></view>
            <u-form :model="form" label-width="120">
                <u-form-item label="金额" :border-bottom="false"><u-input v-model="form.amount" placeholder="请输入提现金额" type="number" /></u-form-item>
                <u-form-item label="验证码" borderBottom>
                    <view class="flex">
                        <u-input
                            class="flex-1"
                            v-model="form.code"
                            placeholder="请输入验证码"
                            :border="false"
                        />
                        <view @click="sendSms">
                            <u-verification-code
                                ref="uCodeRef"
                                :seconds="60"
                                @change="codeChange"
                                change-text="x秒"
                            />
                            {{ codeTips }}
                        </view>
                    </view>
                </u-form-item>
            </u-form>
        </view>
        <view class="m-4">
            <view>
                    <u-button class="btn-cyan-gradient" shape="circle" :loading="btnLoading" @click="submitForm"> 提交 </u-button>
            </view>
            <view class="tips">
                <view class="font-bold">提现说明</view>
                <view>1、运营机构会在3个工作日内处理提现申请，提现结果可在提现记录查看</view>
                <view>2、有任何疑问，请联系客服</view>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
import { onShow,onShareAppMessage } from '@dcloudio/uni-app';
import { useAppStore } from '@/stores/app';
let appStore = useAppStore();
const uCodeRef = shallowRef()
const codeTips = ref('')
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
let userInfo = ref();
let wallet = ref();
let btnLoading = ref(false);
let form = reactive({
    userId: null,
    amount: null,
    status: 0,
    code: null,
});
const getWallet = () => {
    proxy.$http('get', '/admin/appuser/user/wallet', {}, (data,msg) => {
        wallet.value = data;
    })
}
const codeChange = (text: string) => {
    codeTips.value = text
};
const sendSms = () => {
    if (uCodeRef.value?.canGetCode) {
        proxy.$http('get', '/admin/appmobile/approve/code',{}, (data,msg) => {
            uni.$u.toast('发送成功')
            uCodeRef.value?.start()
        });
    }
};
const verifyForm = () => {
    if(Number(form.amount) == 0){
        uni.showToast({title:'请输入提现金额', icon: 'none'})
        return false;
    }
    if(!proxy.$verify.null(form.code, '请输入验证码')){
        return false;
    }
    if(Number(form.amount) > wallet.value.balance){
        uni.showToast({title:'提现金额不能大于' + wallet.value.balance, icon: 'none'})
        return false
    }
    return true;
}
const submitForm = () => {
    if(!verifyForm()){
        return;
    }
    btnLoading.value = true;
    proxy.$http('post', '/admin/withdrawal/create', form, (data,msg) => {
        uni.showToast({title: '提交成功！', icon: 'none'});
        uni.navigateBack({delta:-1});
        btnLoading.value = false;
    }, msg => {
        btnLoading.value = false;
    });
}
onShow(() => {
    userInfo.value = appStore.userInfo; 
    form.userId = userInfo.value.userId;
    getWallet();
})
</script>
<style>
/* page{height:100%;background:#fff;} */
</style>